<%@ Page Title="" Language="C#" MasterPageFile="~/Views/Shared/Site.Master" Inherits="System.Web.Mvc.ViewPage<AvansRS.Domain.EventDate>" %>
<%@ Import Namespace="AvansRS.Domain" %>

<asp:Content ID="Content2" ContentPlaceHolderID="HeadContent" runat="server">
<%
    string action = Url.Action("RegisterOnEvent", "Register");
     %>
    <link href="../../Content/Roster.css" rel="stylesheet" type="text/css" />

    <script src="../../Scripts/jquery-1.3.2.js" type="text/javascript"></script>
    <%
    Entity ent = AvansRS.Web.Util.SessionHelper.GetLoggedIn(this.User).Entity;
    string enabled = "true";
    if (Model.TakenByEntity(ent))
        enabled = "false"; %>
    <script type="text/javascript">
        var enabled = <%=enabled %>
        $(function() {
            $('table tbody tr').mouseover(function() {
            if (enabled) {
                    $("#check" + this.id).css("background-color", "#88DE7A");
                    $("table tbody tr").css("cursor", "pointer");
                }
            }).mouseout(function() {
                $("#check" + this.id).css("background-color", "white");
            }).click(function() {
            if (enabled) {
                    register(<%=Model.ID.ToString() %>, this.id);
                }
            });
            13
        });


        function register(eventDateId, timeBlockId) {
            $.getJSON("<%=action %>?eventDateID=" + eventDateId + "&timeBlockID=" + timeBlockId, null, function(data) {
                //$("#check" + timeBlockId).css("visibility", "visible");
                if (data) {
                    $("#icon").css("background-image", "url(/Content/images/Check-icon-large.png)");
                    $("#confirmed" + timeBlockId).fadeIn("slow");
                    $("#message").css("color", "#65D164");
                    $("#message").text("Je hebt je successvol ingeschreven.");
                    $("#message").fadeIn("slow");
                    $("#icon").fadeIn("slow");
                    $("table tbody tr").css("cursor", "default");
                    enabled = false;
                }
                else
                {                    
                    $("#message").css("color", "#CF1C1C");
                    $("#message").text("Het inschrijven is mislukt, probeer het nog eens.");                    
                    $("#icon").css("background-image", "url(/Content/images/Remove-icon.png)");
                    $("#icon").fadeIn("slow");
                    $("#message").fadeIn("slow");                
                }
            });
        }
</script>
</asp:Content>

<asp:Content ID="Content1" ContentPlaceHolderID="MainContent" runat="server">
<%
    Entity entity = AvansRS.Web.Util.SessionHelper.GetLoggedIn(this.User)
        .Entity;
    IList<AvansRS.Domain.TimeBlock> timeBlocks = Model.Rooster.TimeBlock;%>
    <h2>RegisterOnEventDate</h2>
    Selecteer een tijd waarop jeje wilt inschrijven:
    <br/>
    <br/>
    <div style="width: 265px; height: 24px;"><div id="icon" class="icon"></div><div id="message" class="message"></div></div>
    
    <br />
    <br />
    
    <table class="schedule">
        <thead>
            <tr>
                <th class="header">Uur</th><th class="header">Inschrijving</th>
            </tr>
        </thead>  
        <tbody>
            <%
               int i = 0;
               foreach (AvansRS.Domain.TimeBlock hour in timeBlocks)
               {
                   string hourStr = "";
                   if (i.ToString().Length == 2)
                       hourStr = i.ToString();
                   else
                       hourStr = "&nbsp; " + i.ToString();

                   string fullHourString = hourStr + ". " + hour.StartTime.ToShortTimeString() + " - " +
                                           hour.EndTime.ToShortTimeString();
                   %>
                        <tr id="<%=hour.ID.ToString() %>">
                        <td><%=fullHourString %></td>                                             
                        <%  
                            if(Model.RegistrationTaken(hour) && Model.TakenByEntityOnHour(entity, hour))
                            {
                                %>
                                <td>
                                <div class="confirmedVisible" ></div>                             
                                <%
                                }
                            else if(Model.RegistrationTaken(hour))
                            {%>
                            <td>
                                Bezet!
                            <%}
                            else
                            {
                         %>     
                         <td id="check<%=hour.ID.ToString() %>" class="check">                     
                       <% } %>
                       <div id="confirmed<%=hour.ID.ToString() %>" class="confirmed" ></div>
                       </td>
                        </tr>
                   <%
                   i++;
               }
            %>        
        </tbody>          
    </table>

</asp:Content>
